import React, {FC} from 'react';
import "./index.less";
import {FormattedMessage, Link} from "@@/exports";
import {useRequest} from "ahooks";
import * as API from "@/services";
import {Carousel} from "antd";
import useNewsAnalyze from "@/pages/NewsPage/commons/useNewsAnalyze";



interface HsAdNewsItemProps {
  news: API.FrontNews;
}

const HsAdNewsItem: FC<HsAdNewsItemProps> = (props) => {
  const {news: item} = props;
  const {linkUrl} = useNewsAnalyze(item);
  return (
    <Link to={linkUrl} className={"hs-ad-news-title"} target="_blank">
      <img src={item.img}/>
    </Link>
  );
};


interface HealthScienceAdProps {
}

/**
 * 健康科普ad
 */
const HealthScienceAd: FC<HealthScienceAdProps> = (props) => {

  const dataReq = useRequest(() => API.queryFrontNewss({
    pageSize: 3,
    //types: "HS_CAROUSEL",
    types: "AD_CAROUSEL",
  }), {refreshDeps: []});

  const data = dataReq.data?.data;
  if (dataReq.data?.total === 0) {
    return null;
  }

  return (
    <div className={"health-science-ad-container"}>
      <Carousel autoplay>
        {
          data?.map((item, index) => {
            return (
              <HsAdNewsItem news={item}/>
            )
          })
        }
      </Carousel>
    </div>
  );
};

export default HealthScienceAd;
